<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>test</title>
	<style>        
* {padding: 0;margin: 0;}
        #CertificationFirst.main {width: 100mm;height: 140mm;box-sizing: border-box;background-color: #fff;}
        #CertificationFirst .content {position: relative;min-height: 160mm;border:1px solid #000;}
        /* Border styles */
        #CertificationFirst table thead,#CertificationFirst table tr {border-top-width: 1px;border-top-style: solid;border-top-color: #ebf2e0;text-align: center;}
        #CertificationFirst table th {border-bottom-width: 1px;border-bottom-style: solid;border-bottom-color: #ebf2e0;}
        /* Padding and font style */
        #CertificationFirst table td {font-size: 11px;color: #95aa6d;}
        #CertificationFirst #output td {font-size: 9px;}
        #CertificationFirst table th {font-size: 10px;color: #95aa6d;}
        /* Alternating background colors */
        #CertificationFirst table tr:nth-child(even) {background: rgb(230, 238, 214);}
        #CertificationFirst table tr:nth-child(odd) {background: #FFF;}
        #CertificationFirst .font-size {font-size: 8px;display: inline-block;padding: 2px 0;}
        #CertificationFirst .title {font-size: 13px;}
        #CertificationFirst .logo {box-sizing: border-box;font-family: Microsoft YaHei, Microsoft Simhei, SimSun;height:60px;}
        #CertificationFirst .logo span {float: left;font-size: 12px;}
        #CertificationFirst .logo-img {width: 120px;max-height: 60px;}
        #CertificationFirst hr {width: 100%;height: 2px;border: 0;border-top: 1px solid #95aa6d;}
        #CertificationFirst .logo span.company {width: 60mm;font-size: 15px;line-height: 5mm;text-align: center;padding-top: 18px;box-sizing: border-box;font-weight: bold;float: right;}
        #CertificationFirst .company-info {width: 100%;}
        #CertificationFirst .company-info li {font-size: 10px;margin: 0px 3px 0px 3px;color: #95aa6d;display: inline-block;white-space: nowrap;width: 47.5%;float: left;}
        #CertificationFirst .barcode {width: 300px;margin: 0 auto;}
        #CertificationFirst .total {font-size: 12px;padding-left: 10px;}
        #CertificationFirst .left {text-align: left;}
        #CertificationFirst .right {text-align: right;}
        .shrink {-webkit-transform: scale(0.8);-o-transform: scale(1);display: inline-block;}
        .main_left{width: 17mm;text-align: center;float: left;color: #95aa6d;}
        .main_right{display: inline-block;float: left;color: #95aa6d;}
    </style>
</head>
<body>
<div class="barcode" style="margin-bottom:40px; display: block;">
                <!--BarCode-->
                <span id="barcode" style="display:none">1,2mm,10mm,88mm,9mm</span>
            </div>
    <div class="main" id="CertificationFirst">
        <div class="head">
            <div class="logo" style="overflow:hidden;">
                <span class="logo-img">
                    <i>
                        <!--http://001.bwg2017.com/UploadFile/Template/-->
                        <img src="<!--ImgUrl--><!--FinishLogoUrl-->" class="logo-img" id="img_lg" />
                    </i>
                </span>
                <span class="company">
                    <p>
                        <!--CompanyName-->
                    </p>
                    <span class="shrink" style="font-size: 6px; width: 60mm;">
                        <!--CompanyNameEn-->
                    </span>
                </span>
            </div>
            <hr />
            <hr />
            <div>
                <ul class="company-info" style="overflow: hidden;">
                    <!--CompanyAddressStart-->
                    <li>地址：
                        <!--CompanyAddress-->
                    </li>
                    <!--CompanyAddressEnd-->
                    <!--CompanyTelStart-->
                    <li style="text-align: right;">电话(TEL):
                       <!--CompanyTel-->               
                    </li>
                    <!--CompanyTelEnd-->
                    <!--CompanyAddressEnStart-->
                    <li>ADD : 
                        <!--CompanyAddressEn-->
                    </li>
                    <!--CompanyAddressEnEnd-->
                    <!--CompanyPostCodeStart-->
                    <li style="text-align: right;">邮编(P.C) ：
                        <!--CompanyPostCode-->

                    </li>
                    <!--CompanyPostCodeEnd-->
                    <!--CompanyWebSiteStart-->
                    <li>网址 :
                        <!--CompanyWebSite-->
                    </li>
                    <!--CompanyWebSiteEnd-->
                    <!--CompanyFaxStart-->
                    <li style="text-align: right;">传真(FAX) :
                        <!--CompanyFax-->
                    </li>
                    <!--CompanyFaxEnd-->
                </ul>
            </div>
            
            <hr />
        </div>
        <div class="content" style="width:97%;">
            <table border="0" style="width:100%;">
                <tr>
                    <td colspan="1" width="60" class="title">
                        <span class="font-size" style="text-align: left;">CustomerNO.</span>
                        <br /> 客户名称
                    </td>
                    <td colspan="3">
                        <!--CustomerName-->+<!--ProjectName-->
                    </td>
                </tr>
	        <!--ProductNameEnStart-->
                <tr>
                    <td colspan="1" class="title">
                        <span class="font-size">Product Name.</span>
                        <br /> 产品名称
                    </td>

                    <td colspan="3">
                        <!--ProductName-->
                    </td>
                </tr>
                  <!--ProductNameEnEnd-->
                <tr>
                    <td colspan="1" class="title">
                        <span class="font-size">ProductionNO.</span>
                        <br /> 生产批号
                    </td>
                    <td colspan="3">
                        <!--OrderCode-->&emsp;(<!--DeliveryAddress-->)
                    </td>
                </tr>
                <tr>
                    <td colspan="1" class="title">
                        <span class="font-size">CaseNO.</span>
                        <br /> 发货架号
                    </td>
                    <td colspan="3">
                        <!--StockInCode-->
                    </td>
                </tr>
                <tr>
                    <td colspan="1" class="title">
                        <span class="font-size">Executive Standard.</span>
                        <br /> 执行标准
                    </td>
                    <td colspan="3" align=left>
                        <!--ExecutiveStandard-->
                    </td>
                </tr>
            </table>

       <!--ItemListStart1-->
                   <!--ProductStart1-->
                    <li> 
                           <div class="main_left">
                            <span class="font-size">Product Name.</span>
                            <br /> 产品名称
                             </div>
                          <div class="main_right"> <!--ProductName--></div>
                    </li>
                    <!--ProductEnd1-->
<hr>
            <table style="width: 100%;" border="0">
                <thead>
                    <tr>
                        <th width="100">Size 规格</th>
                        <th width="">Remarks &nbsp;&nbsp;备注</th>
                        <th width="60">Pcs 数量</th>
                        <th width="60">Area 面积</th>
                    </tr>
                </thead>
                <tbody id="output">
                    <!--ItemListStart-->
                    <tr>
                        <td>
                            <!--ItemSize-->
                        </td>
                        <td>
                            <!--ItemRemarks-->
                        </td>
                        <td>
                            <!--ItemPcs-->
                        </td>
                        <td>
                            <!--ItemArea-->
                        </td>
                    </tr>
                    <!--ItemListEnd-->
                </tbody>
            </table>
           <!--ItemListEnd1-->
            <div style="height:67px"></div>
            <table style="width: 100%; position: absolute; bottom: 0" border="0">
                <tr>
                    <th width="70"></th>
                    <th width="100"></th>
                    <th width="60"></th>
                    <th width="60"></th>
                </tr>
                <tr>
                    <td colspan="2" class="total left">Total &nbsp;&nbsp;合计</td>
                    <td><!--TotalPcs-->(片)</td>
                    <td><!--TotalArea-->(㎡)</td>
                </tr>
                <tr>
                    <td colspan="3" class="total right">
                        <span class="font-size">Q.C.</span> &nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 质检 &nbsp;&nbsp;</td>
                    <td><!--QcName--></td>
                </tr>
                <tr>
                    <td colspan="3" class="total right">
                        <span class="font-size">Production Date</span> &nbsp;生产日期</td>
                    <td><!--StockInDate--></td>
                </tr>
            </table>
        </div>
    </div>
</body>
<script>
   	$(function () {
   	    var h = $("#output").height()
   	    if(h < 125){
   	    $(".total_bar").css("position" , "absolute");		
   	   }
   	})
</script>
</html>